<style type="text/css">
	#turntable-container{
		width: 240px;
		height: 240px;
		margin: 0 auto;
		position: relative;
		text-align: center;
	}
	#turntable-outer{
		width: 240px;
		height: 240px;
		position: absolute;
	}
	
	#turntable-inner{
		width: 86px;
		margin: 0 auto;
		cursor: pointer;
		position: absolute;
		top: 54px;
		left: 76px;
	}
	#turntable-inner img,
	#turntable-outer img{
		width: 100%;
	}
	
	#turntable-outer img{
		-webkit-transform: rotate(0deg);
	}
</style>
<div class="rich-prize-pic">
	<div id="turntable-container">
		<div id="turntable-outer">
			<img src="__STYLE__/RedPaper/turntable_table.png" />
		</div>
		<div id="turntable-inner">
			<img src="__STYLE__/RedPaper/turntable_needle.png" />
		</div>
	</div>
</div>

<div class="rich-action">
	<!--邀请者信息-->
	<div class="rich-info">您的朋友 <span>{$hostInfo.nickname}</span> 邀请您为ta抽红包，帮助朋友义不容辞，快点助ta一臂之力吧！</div>
	<a id="bt-play" class="button button-block button-rounded button-flat-royal">帮朋友抽红包，请叫我雷锋</a>
	<empty name="userInfo.hid">
		<a id="bt-host" class="button button-block button-rounded button-flat-caution">我也要发起活动</a>
		<else />
		<a id="bt-home" class="button button-block button-rounded button-flat-caution">查看我的活动信息</a>
	</empty>
</div>
<!--转盘-->
<script type="text/javascript">
	var outer = document.getElementById('turntable-outer');
	var inner = document.getElementById('turntable-inner');

	(function() {
		// 中奖等级，与后端一致： [20, -10, 30, -5, 10, -20, 5, 0];
		var prizeMoney = [20, -10, 30, -5, 10, -20, 5, 0];
		
		var prizeDeg = [24, 69, 113, 159, 203, 246, 295, 337];
		var stopDeg = 0;

		var totalDeg = 360 * 3 + 0;
		var gravity = 0.02;
		var timer = null;
		var now = 0;
		var running = false;
		var steps = [];
		var i = 0;
		var finish = false;
		var result = null;

		// 转盘信息
		window.requestAnimFrame = (function() {
			return window.requestAnimationFrame ||
				window.webkitRequestAnimationFrame ||
				window.mozRequestAnimationFrame ||
				window.oRequestAnimationFrame ||
				window.msRequestAnimationFrame ||
				function(callback) {
					window.setTimeout(callback, 20);
				};
		})();

		function getMoney(deg) {
			for (var i = 0, l = prizeDeg.length; i < l; i++) {
				if (deg == prizeDeg[i]) {
					return prizeMoney[i] || 0;
				}
			}
			return 0;
		}

		function countSteps() {
			var t = Math.sqrt(2 * totalDeg / gravity);
			var v = gravity * t;
			for (var i = 0; i < t; i++) {
				steps.push((2 * v * i - gravity * i * i) / 2);
			}
			steps.push(totalDeg);
		}

		function step() {
			outer.style.webkitTransform = "rotate(" + steps[now++] + "deg)";
			outer.style.MozTransform = "rotate(" + steps[now++] + "deg)";
			outer.style.msTransform = "rotate(" + steps[now++] + "deg)";
			outer.style.transform = "rotate(" + steps[now++] + "deg)";
			if (now < steps.length) {
				requestAnimFrame(step);
			} else {
				setTimeout(function() {
					running = false;
				}, 200);
				var money = getMoney(stopDeg);
				var msg;
				if (money > 0) {
					msg = "恭喜您，抽中了 " + money + " 元！";
				} else if (money < 0) {
					msg = "很遗憾，抽中了 " + money + " 元...";
				} else {
					msg = "没关系，您已经尽力了。";
				}
				simapp.toast(msg);
			}
		}

		function start(deg) {
			stopDeg = deg || prizeDeg[parseInt(prizeDeg.length * Math.random())];

			running = true;
			clearInterval(timer);
			totalDeg = 360 * 5 + stopDeg;
			steps = [];
			now = 0;
			countSteps();
			requestAnimFrame(step);
		}

		function turn() {
			if (running) {
				return;
			}

			if (hostInfo.uid == userInfo.id) {
				simapp.toast("自己不可以给自己抽红包哦~");
				return;
			}

			if (hostInfo.timesPlayed >= activity.timesPerDay) {
				simapp.toast("您今天已经帮过ta啦，明天再帮吧~");
				return;
			}

			$.ajax({
				type: "POST",
				url: "__CONTROLLER__/turn?debug",
				data: {
					cid: userInfo.cid,
					aid: userInfo.aid,
					uid: userInfo.id,
					hid: hostInfo.id
				},
				beforeSend: function() {
					simapp.toast("准备抽红包……");
				},
				success: function(response) {
					if (response.state && response.state == 1) {
						var index = response.data.index;
						running = true;
						timer = setInterval(function() {
							i += 5;
							outer.style.webkitTransform = "rotate(" + i + "deg)";
							outer.style.MozTransform = "rotate(" + i + "deg)";
							outer.style.msTransform = "rotate(" + i + "deg)";
							outer.style.transform = "rotate(" + i + "deg)";
						}, 20);
						start(prizeDeg[index]);

					} else {
						simapp.toast(response.msg);
					}
				},
				error: function(xhr, errorType, error) {
					simapp.toast("请重新打开页面尝试！");
				},
				complete: function() {}
			});
		}

		window.turn = turn;
		inner.addEventListener('click', turn, false);
	})();
</script>

<script type="text/javascript">
	$(function() {

		$('#bt-host').click(function() {
			var othis = $(this);
			if (userInfo && userInfo.subscribe) {
				simapp.toast('正在申请发起活动，请稍候……');
				$(this).attr('disabled', true);
				$.ajax({
					type: 'POST',
					url: '__CONTROLLER__/host?debug',
					data: {
						cid: userInfo.cid,
						aid: userInfo.aid,
						uid: userInfo.id
					},
					beforeSend: function() {
						othis.attr("disabled", true);
					},
					success: function(response) {
						if (response.state && response.state == 1) {
							simapp.toast(response.msg);
							location.href = activity.shareUrl;
						} else {
							simapp.toast(response.msg);
						}
					},
					error: function(xhr, errorType, error) {
						simapp.toast("请重新打开页面尝试！");
					},
					complete: function() {
						othis.removeAttr('disabled');
					}
				});
			} else {
				simapp.tips('关注公众平台后才能发起活动哦，关注后还能获得 <b>' + activity.defaultMoney + '</b> 元的初始红包呢！还等什么，快点关注吧！<br />关注方法：点击右上角->查看公众号->关注');
			}
		});

		// 帮助抽红包
		$('#bt-play').click(function() {
			turn();
		});

		// 查看我的活动信息
		$('#bt-home').click(function() {
			location.href = activity.shareUrl;
		});

	});
</script>